import { useContext } from 'react'
import createTo from '../../../../../stores/contextTodoList'

const Main = (props) => {
  const content = useContext(createTo)
  return (
    <div>
      <div className="list">
        <ul className="listUl">
          <li>标签</li>
          <li>日期</li>
          <li onClick={() => props.sort(false)}>
            优先级 {props.isShow ? <span> ↑ </span> : <span> ↓ </span>}
          </li>
        </ul>
        <ul>
          {content.todolist.map((item, key) => (
            <div key={key} className="divul">
              <li>{item.name} </li>
              <li>{item.date}</li>
              <li
                className={
                  item.priority === '1'
                    ? 'color0'
                    : item.priority === '2'
                    ? 'color1'
                    : 'color2'
                }
              >
                {item.priority}
              </li>
            </div>
          ))}
        </ul>
      </div>
    </div>
  )
}

export default Main
